<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html class="ui-mobile">
<head>
<link href="http://static.image.alimmdn.com/favicon.ico?t=123654" rel="shortcut icon">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="user-scalable=no">
<title>生成订单</title>
<link rel="stylesheet" href="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css">
<style type="text/css">
	body{
		font-family:"Microsoft YaHei";
		font-size: 42px;
	}
	span,a{
		font-size: 42px;
		color: #39ad36;
	}
	#select-restaurants-button span{
		text-align: left;
	}
	h1{
		color: #39ad36;
	}
</style>
</head>
<body class="ui-mobile-viewport ui-overlay-a">
	<div data-role="page" style="margin: 0;">
		<input id="tip" type="hidden"/>
		<input id="addrId" type="hidden" />
		<input id="advertId" value="${advertId}"  type="hidden"/>
		<div role="main" class="ui-content" style="font-size: 42px;">
			<label for="description" style="color: #39ad36;font-size: 42px;">订单描述:</label>
			
			<textarea disabled="disabled" id="description" rows="5" style="resize:none;padding: 10px 20px;font-size: 42px;min-height: 200px;margin-bottom: 40px;">${description}</textarea>
			<select id="select-restaurants" name="select-restaurants" data-native-menu="true" onchange="setTip()">
				<option value="-1">选择小费</option>
				<c:forEach items="${tipList}" var="utip">
					<option value="${utip}"<c:if test="${tip eq utip}"> selected="selected"</c:if>>${utip}元</option>
				</c:forEach>
			</select>
			<ul data-role="listview" data-inset="true" class="ui-nodisc-icon ui-alt-icon" style="margin: 10px 0 60px;">
			    <li><a href='<c:url value="/activity/address?userId=${userId}"/>'><span style="height: 100px;color: #39ad36;font-size: 42px;">送达地址</span></a></li>
			</ul>
			<input id="commAddressId" type="hidden" value="${commAddressId}">
			<c:if test="${!empty commaddress}">
				<div style="margin: 15px 0;background-color: #EEEEEE;padding: 0 20px;">
					<div style="padding: 15px 0;">
						<span style="font-size: 1.2em">${commaddress.name}</span>
						<span style="float: right;font-size: 1.2em">${commaddress.telephone}</span>
					</div>
					<div style="padding: 15px 0;">
						<span style="color: #666666;font-size: 1.2em">${commaddress.text}</span>
					</div>
				</div>
			</c:if>
			<a href="javascript:void(0)" id="doCreate" onclick="createOrder()" class="ui-btn" style="background-color: #39ad36;padding:35px 0;">
				<span style="color: #ffffff;font-size: 45px;">下呼单</span>
			</a>
		</div><!-- /content -->
	</div>
	<div id="allmap"></div>
	<div data-role="popup" id="popupBasic" data-dismissible="false" class="ui-corner-all ui-content" style="background-color: #EEEEEE;min-width: 600px;padding: 20px;">
	<!-- <a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a> -->
	<h2 style="text-align:center;padding: 10px 0 0;font-size: 60px;">提示</h2>
    <p id="message" style="text-align:center;font-size: 42px;padding: 10px 0;"></p>
    <!-- <div style="text-align: center;background-color: #39ad36;height: 100px;"></div> -->
    <a href="javascript:closePop()"  style="font-size: 45px;line-height: 35px;margin: 0;border-style:none;color:white;background-color: #39ad36;" class="ui-btn">确定</a>
</div>
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script type="text/javascript">
function closePop(){
	$("#popupBasic").popup('close');
}
$("#popupBasic").popup();
function createOrder(){
	if($("#select-restaurants").val()){
		if($("#select-restaurants").val()==-1){
			$("#message").html('请选择小费');
			$("#popupBasic").popup('open');
		}else{
			if($("#commAddressId").val()){
				var params = {
					'tip':$("#select-restaurants").val(),
					'type':1,
					'ordertypeid':2
				}
				var url = '<c:url value = "/activity/createOrder"/>';
				$.post(url,params,function(data){
					if(data.code==0){
						//调用移动端的方法
						window.mobile.JsFinish();
					}else{
						$("#message").html('发布失败，请重试');
						$("#popupBasic").popup('open');
					}
				},"json");
			}else{
				$("#message").html('请选择地址');
				$("#popupBasic").popup('open');
			}
		}
	}
}

function setTip(){
	var url = '<c:url value = "/activity/setTip"/>';
	var params = {
			'tip':$("#select-restaurants").val()
	}
	$.post(url,params,function(data){
		if(data.code==0){
			$("#tip").val($("#select-restaurants").val());
		}
	},"json");	
}

var userId = ${userId};
function checkVal(){
	var name = $("#name").val();
	var telephone = $("#telephone").val();
	var addr = $("#addr").val();
	if (!name){
		$("#message").html('请输入用户名');
		$("#popupBasic").popup('open');
		return false;
	}
	if(!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(telephone))){
    	$("#message").html('请输入正确的手机号');
		$("#popupBasic").popup('open');
    	return false;
    }
	if (!addr) {
    	$("#message").html('请输入地址');
		$("#popupBasic").popup('open');
		return false;
	}
	var params = {
		'name':name,
		'telephone':telephone,
		'text':addr,
		'userid':userId
	}
	var url = '<c:url value = "/activity/addAddr"/>';
	$.post(url,params,function(data){
		if(data.code==0){
			var url = '<c:url value="/activity/makeOrder"/>?userId='+userId;
			location.href=url;
		}
	},"json");
}

function selectAddr(addrId){
	var url = '<c:url value = "/activity/selectAddrId"/>';
	var params={
		'addrId':addrId
	}
	$.post(url,params,function(data){
		if(data.code==0){
			var url = '<c:url value="/activity/makeOrder"/>?userId='+userId;
			location.href=url;
		}
	},"json");
}
function connectWebViewJavascriptBridge(callback) {
    if (window.WebViewJavascriptBridge) {
        callback(WebViewJavascriptBridge)
    } else {
        document.addEventListener('WebViewJavascriptBridgeReady', function () {
            callback(WebViewJavascriptBridge)
        }, false)
    }
}
connectWebViewJavascriptBridge(function (bridge) {
    bridge.init(function (message, responseCallback) {
        log('JS got a message', message)
        var data = {'Javascript Responds': 'Wee!'}
        log('JS responding with', data)
        responseCallback(data)
    })

    bridge.registerHandler('backAction', function (data, responseCallback) {
        log('ObjC called testJavascriptHandler with', data)
        var responseData = {'Javascript Says': 'Right back atcha!'}
        log('JS responding with', responseData)
        responseCallback(responseData)
    })

    bd = bridge;
    
    var button = document.getElementById('doCreate')
    button.onclick = function (e) {
        e.preventDefault();
        if($("#select-restaurants").val()){
    		if($("#select-restaurants").val()==-1){
    			$("#message").html('请选择小费');
    			$("#popupBasic").popup('open');
    		}else{
    			if($("#commAddressId").val()){
    				var params = {
    					'tip':$("#select-restaurants").val(),
    					'type':1,
    					'ordertypeid':2
    				}
    				var url = '<c:url value = "/activity/createOrder"/>';
    				$.post(url,params,function(data){
    					if(data.code==0){
    						//调用移动端的方法
   							var data = 'create order';
  					        	bridge.send(data, function (responseData) {
  					            alert('JS got response'+ responseData);
  					       	});
    					}else{
    						$("#message").html('发布失败，请重试');
    						$("#popupBasic").popup('open');
    					}
    				},"json");
    			}else{
    				$("#message").html('请选择地址');
    				$("#popupBasic").popup('open');
    			}
    		}
    	}
    }
})
</script>
</body>
</html>